<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

    <link rel="stylesheet" href="./../lib/bootstrap/css/bootstrap.css">

    <link rel="stylesheet/less" href="./../css/base.css">
    <link rel="stylesheet/less" href="./../css/productlist.css">

    <script src="./../lib/less/less.js"></script>
</head>

<body>
    <!-- 头部区域 -->
    <header id="header">
        <a href="#" class="logo"><img src="images/header_logo.png" alt=""></a>
        <a href="#" class="app"><img src="images/header_app.png" alt=""></a>
    </header>

    <!-- 搜索区域 -->
    <section id="search">
        <form action="#">
            <input type="search" name="" id="" placeholder="请输入要比价的商品">
            <input type="submit" value="搜索">
        </form>
    </section>

    <!-- 商品列表 -->
    <section id="productList">
        <!-- 三级标题 -->
        <div class="category-title">
            <ol class="breadcrumb">
                <li><a href="index.html">首页</a></li>
                <li><a href="category.html">全部分类</a></li>
                <li>空调</li>
            </ol>
            <a href="#" class="btn btn-default">筛选</a>
        </div>

        <!-- 商品列表-->
        <div class="product-list">
            <!-- 
            <div class="media">
                <a class="media-left" href="#">
                    <img src="" alt="...">
                </a>
                <div class="media-body">
                    <h5>奥克斯(AUX) KFR-25GW/FK01+3 1匹 挂壁式定速冷暖空调</h5>
                    <p class="price">￥1499.00</p>
                    <em>报价(4)</em><em>评论(2403)</em>
                </div>
            </div>
            -->
        </div>

        <!-- 上一页 下一页-->
        <div class="prodocut-option clearfix">
            <a href="#" class="btn btn-default page-prev">上一页</a>
            <a href="#" class="btn btn-default page-next">下一页</a>

            <!-- 第几页 -->
            <div class="dropdown">
                <a id="dLabel" data-target="#" href="" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        第一页
                        <span class="caret"></span>
                    </a>
                <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                    <li>第一页</li>
                    <li>第二页</li>
                    <li>第三页</li>
                </ul>
            </div>
        </div>
    </section>

    <!-- 底部 -->
    <footer id="footer">
        <div class="row">
            <div class="col-xs-4">
                <a href="#">登录</a>
            </div>
            <div class="col-xs-4">
                <a href="#">注册</a>
            </div>
            <div class="col-xs-4">
                <a href="#">返回顶部</a>
            </div>
        </div>
        <p> <a href="#">手机APP下载</a> <a href="#">慢慢买手机版</a> -- 掌上比价平台</p>
        <p>m.manmanbuy.com </p>
    </footer>

    <!-- 字符串模板 -->
    <script type="text/html" id="categoryTitleTmp">
        {{each result as value i}}
        <li><a href="#">首页</a></li>
        <li><a href="#">全部分类</a></li>
        <li>{{value.category}}</li>
        {{/each}}
    </script>
    <script type="text/html" id="productListTmp">
        {{each result as value i}}
        <div class="media">
            <a class="media-left" href="#">
                {{#value.productImg}}
            </a>
            <div class="media-body">
                <h5><a href="bijia.html?productid={{value.productId}}">{{value.productName}}</a></h5>
                <p class="price">{{value.productPrice}}</p>
                <em>{{value.productQuote}}</em><em>{{value.productCom}}</em>
            </div>
        </div>
        {{/each}}
    </script>
    <script src="./../lib/jquery/jquery.js"></script>
    <script src="./../js/url.js"></script>
    <script src="./../lib/bootstrap/js/bootstrap.js"></script>
    <script src="./../js/template.js"></script>
    <script src="./../js/productlist.js"></script>
</body>

</html>